<!DOCTYPE html>
<html lang="en">
<head>
    <title>{{title}}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="{{ROOT}}/images/favicon.ico">
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/lhh_lib.css" />
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/zh_tab.css" />
    <link rel="stylesheet" type="text/css" href="{{ROOT}}/css/bootstrap-datetimepicker.css" />
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. -->
    <!--[if lt IE 9]>
    <script type="text/javascript" src="{{ROOT}}/js/html5shiv.js"></script>
    <![endif]-->

</head>
<body class="content">
<div class="row _lhh_breadcrumb MB10 visible-lg">
    <ul class="breadcrumb pull-left">
        <li><a href="index.html">首页</a></li>
        <li class="active">年度月发电量对比</li>
    </ul>
    <div class="p-rel">
        <div class="_lhh_breadcrumb-more MR15">
            <!--电子时钟 begin-->
            <include file="{{ROOT}}/controllers/include/clock.html" dataType="html"></include>
            <!--电子时钟 end-->
        </div>
    </div>
</div>
<div class="row">
    <div class="col-mod-12">
        <div class="page-header">
            <div class="ML10 MT10">
                <label class="MR5">年份</label>
                <input type="text" class="page-header-input form-control">
                <button type="submit" class="btn page-header-btn ML30">查询</button>
            </div>
        </div>
    </div>
</div>
<div class="row MB30">
    <div class="col-md-12 MT20">
        <div class="echarts" style="height: 400px;width:100%;" id="echarts-column-chart"></div>
    </div>
</div>
</body>
</html>


<script type="text/javascript" src="{{ROOT}}/js/highstock.js"></script>
<script type="text/javascript" src="{{ROOT}}/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="{{ROOT}}/js/datetimepicker-custom.js"></script>




<script type="text/javascript">
    LAMJS.main(function(){
        'use strict';
        var System=this;

        function highstock(){
            var seriesOptions = [],
                    seriesCounter = 0,
                    names = ['MSFT', 'AAPL'];
            $.each(names, function (i, name) {
                $('#echarts-column-chart').highcharts({
                    chart: {
                        height: 620,
                        zoomType: 'column',
                        plotBackgroundColor:'#eef4ff'     //绘图区背景色
                    },
                    credits: {
                        enabled:false    //不显示版权标签
                    },
                    title: {
                        text: '2015年 月发电量对比',
                        style:{
                            fontFamily:'SimHei'
                        }
                    },
                    xAxis: [{
                        categories: ['2015-01', '2015-02', '2015-03', '2015-04', '2015-05', '2015-06',
                            '2015-07', '2015-08', '2015-09', '2015-10', '2015-11', '2015-12']
                    }],
                    yAxis: [{ // Primary yAxis
                        labels: {
                            style: {
                                color: '#000'
                            }
                        },
                        title: {
                            text: '单位(万kWh)'
                        },
                        plotLines: [{
                            value: 0,
                            width: 1,
                            color: '#808080'
                        }],
                        gridLineWidth:0
                    }],
                    legend: {
                        backgroundColor: '#FFF',
                        symbolRadius:2,
                        align: 'center',
                        verticalAlign: 'bottom',
                        borderWidth: 2,
                        symbolWidth:10,
                        symbolHeight:10
                    },
                    series: [{
                        name: '可研设计发电量',
                        type: 'column',
                        data: [49.9, 106.4,71.5, 144.0, 129.2, 135.6, 176.0, 95.6,216.4, 148.5,194.1, 54.4],
                        tooltip: {
                            valueSuffix: 'kw/h'
                        }

                    },{
                        name: '理论发电量',
                        type: 'column',
                        data: ['', '', '', '','', '', 190.0,216.4, '','', '', ''],
                        tooltip: {
                            valueSuffix: 'kw/h'
                        }

                    },{
                        name: '计划上网电量',
                        type: 'column',
                        data: ['', '', '', '','', '',158,180, '','', '', ''],
                        tooltip: {
                            valueSuffix: 'kw/h'
                        }

                    },{
                        name: '实际发电量',
                        type: 'column',
                        data: ['', '', '', '','', '',144.0, 135.6, '','', '', ''],
                        tooltip: {
                            valueSuffix: 'kw/h'
                        }

                    },{
                        name: '上网电量',
                        type: 'column',
                        data: ['', '', '', '','', '',44.0, 100.0, '','', '', ''],
                        tooltip: {
                            valueSuffix: 'kw/h'
                        }

                    }]
                });

            });

        }




        $(window).resize(function() {
            highstock();
        }).trigger('resize');



    });
</script>





